<template>
	<view class="shop page bgf6 p15">
		<view v-for="(item,index) in list" @click="clickItem(item)" class="flex flexC bgff r7 mb12 px10 py22">
			<view class="flex1 ml12">
				<view class="flex flexC flexB">
					<text class="bold6 ellipsis1">{{item.name}}</text>
					<text class="arrowR mr4"></text>
				</view>
			</view>
		</view>
		
		<view class="add r50 bged aliC" @click="clickAdd">添加</view>
		
		<uni-popup ref="setPop" type="bottom">
			<view class="popup-content2">
				<button class="popup-btn button" @click="clickDelete">删除</button>
				<button class="popup-btn button" @click="clickUpdate">修改</button>
		
				<view class="popup-btn" @click="$refs.setPop.close()">取消</view>
			</view>
		
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				shop_id:'',
				item:null
			};
		},
		
		onLoad(option) {
			
			this.shop_id = option.shop_id;
		},
		onShow() {
				
			this.getList();	
		},
		methods:{
			
			clickDelete(){
				
				
				let param = {
					shop_id:this.shop_id,
					id:this.item.id
				};
				let that = this;
				this.$api.onlineCateDelete(param).then(res => {
							
					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.$refs.setPop.close();
						that.getList();
						
					} else {
						uni.showToast({
							title:res.msg,
							icon:'none'
						})	
					}
				})
			},
			clickUpdate(){
				
				this.$refs.setPop.close();
				uni.navigateTo({
					url:'/other/online/cateAdd?shop_id='+this.shop_id+"&id="+this.item.id+"&name="+encodeURIComponent(this.item.name)
				})
			},
			
			clickItem(item){
				this.item = item;
				this.$refs.setPop.open()
			},
			
			getList(){
				let param = {
					shop_id:this.shop_id
				};
				let that = this;
				this.$api.onlineCateList(param).then(res => {
							
					console.info(JSON.stringify(res));
					if (res.code == 1) {
						that.list = res.data;
					} else {
							
					}
				})
			},
			
			
			clickAdd(){
				uni.navigateTo({
					url:'/other/online/cateAdd?shop_id='+this.shop_id
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.shop {
	.w82 {width: 164rpx;height: 164rpx;}
	.ellipsis1 {max-width: 400rpx;}
	.add {
		position: fixed;
		bottom: 100px;
		right: 10rpx;
		width: 80rpx;
		height: 80rpx;
		line-height: 80rpx;
		border: 2rpx solid #F5C51D;
	}
	
	.popup-content2 {
		background: #FFFFFF;
	
		.popup-btn {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
		}
	
		.button {
			width: 100%;
			height: 100rpx;
			line-height: 100rpx;
			text-align: center;
			border-bottom: 1px solid #f5f5f5;
			background: #FFFFFF;
			font-size: 11pt;
		}
	
		button::after {
			border: none;
		}
	
		.pt20 {
			border-bottom: 20rpx solid #f5f5f5;
		}
	}
}
</style>
